<include file="Public/header" />
<title>借款认证</title>
<link rel="stylesheet" href="__PUBLIC__/Api/assets/css/reset.css">
<link rel="stylesheet" href="__PUBLIC__/Api/assets/css/borrow.css">
<link rel="stylesheet" href="__PUBLIC__/Api/assets/css/font-awesome.min.css">
<script src="__PUBLIC__/Api/localResizeIMG.js"></script>
<script src="__PUBLIC__/Api/mobileBUGFix.mini.js"></script>
<style>
    html,
    /*body {*/
        /*height: 100%;*/
        /*overflow: hidden;*/
        /*width: 100%;*/
    /*}*/

    .clearfix:after {
        content: "";
        display: block;
        clear: both;
    }

    #shareBtn {
        cursor: pointer;
    }

    .panel {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        padding: 10px;
        width: 300px;
        border: 1px solid;
        border-radius: 5px;
        background: #fff;
        display: none;
        z-index: 2;
        border: none;
        line-height: 2;
        text-align: center;
    }

    .panel .close {
        float: right;
        margin-top: 15px;
        margin-right: 15px;
        font-size: 1.15rem;
        cursor: pointer;
    }

    .panel .sure,
    .panel .cancel {
        border: 1px solid;
        border-radius: 5px;
        margin: 5px;
        padding: 5px;
        float: right;
        cursor: pointer;
    }

    .shadow {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: #ccc;
        opacity: 0.75;
        z-index: 1;
        display: none;
    }

    .share-tips {
        position: absolute;
        bottom: 20%;
        left: 0;
        width: 100%;
        color: #e2531a;
        text-align: center;
        font-size: 23px;
    }
</style>
</head>

<body>
<div class="bor-header">借款认证
    <i class="fa fa-angle-left back" onclick="goback()"></i>
</div>


<div class="borrow-content" style="padding-top: 20px;">
    <p style="color: rgba(35, 35, 35, 0.69);">扫码成为会员</p>
    <img class="code" id="code" src="{$ewm}" alt="">

    <br/>
    <p style="color: rgba(35, 35, 35, 0.69);">我的凭证</p>
    <img class="code" id="code_wd" src="<?php echo $arr['pz']?$arr['pz']:'__PUBLIC__/Api/images/preId.png'?>" alt="">

    <input type="hidden" name="id" value="<?php echo $arr['id']?>" id="pid">

    <div class="bo-bottom getcode">上传凭证<input type="file" name="file" class="upimg" id="upimg"></div>

    <div class="bo-bottom fx" id="shareBtn">确定</div>
</div>


<!-- 弹框 -->
<div class="panel clearfix">
    <!-- <div class="close">x</div> -->
    <p>截图二维码微信扫一扫，分享朋友圈</p>
    <!-- <div class="cancel">取消</div> -->
    <!-- <div class="sure">确定</div> -->
    <img class="code" id="codex" src="<?php echo $tlewm?>" alt="" />
</div>
<div class="shadow">
    <p class="share-tips">分享朋友圈，完成验证</p>
</div>


<script>
    function goback() {
        history.go(-1); //返回上一页
    }

    function convertBase64UrlToBlob(urlData){

        var bytes=window.atob(urlData.split(',')[1]);        //去掉url的头，并转换为byte

        //处理异常,将ascii码小于0的转换为大于0
        var ab = new ArrayBuffer(bytes.length);
        var ia = new Uint8Array(ab);
        for (var i = 0; i < bytes.length; i++) {
            ia[i] = bytes.charCodeAt(i);
        }

        return new Blob( [ab] , {type : 'image/png'});
    }

    $('#upimg').localResizeIMG({
        width: 400,
        quality: 1.0,
        success: function (result) {
            //ajax 图片上传
            var preID = convertBase64UrlToBlob(result.base64);
            var pid = $('input[name="pid"]').val();
            var formData = new FormData();
            formData.append('upimg', preID);
            formData.append('pid', pid);

            $.ajax({
                url: "",
                type: "post",
                data: formData,
                dataType:'json',
                contentType: false,
                processData: false,
                mimeType: "multipart/form-data",
                success: function (data) {
                    if(data.type==1){
                            $("#code_wd").attr('src', result.base64);
                    }
                    layer.msg(data.msg, {icon: data.type});
                },
                error: function (data) {
                    console.log(data);
                }
            });
        }
    });


    // 弹框
    var panel = $(".panel")[0];
    var btn = $("#shareBtn")[0];
    var close = $(".panel>.close")[0]
    var shadow = $(".shadow")[0]

    btn.addEventListener("click", function (e) {
        e.stopPropagation();
        panel.style.display = "block";
        shadow.style.display = "block";
    })
    shadow.addEventListener("click", function () {
        panel.style.display = "none";
        shadow.style.display = "none";
    })
    panel.addEventListener("click", function (e) {
        e.stopPropagation();
    })
    window.addEventListener("click", function () {
        panel.style.display = "none";
        shadow.style.display = "none";
    })
</script>
</body>
</html>
